import React, { Component } from 'react';
import logo from './logo.svg';
import 'antd/dist/antd.css';
import './App.css';
import {
  BrowserRouter as Router,
  Route,
  Link
} from 'react-router-dom';
import Button from 'antd/lib/button';
import { Row, Col, Icon, Menu, Layout, Breadcrumb } from 'antd';

const SubMenu = Menu.SubMenu;
const MenuItemGroup = Menu.ItemGroup;

const {
  Header,Footer,Sider,Content
} = Layout;

class App extends Component {
  render() {
    return (
      <Router>
        <Layout>
          <Header className="App-header">
            <div className="logo">
              <img className="App-logo" src="./i2mago.png" width="80px"/>
            </div>
            <Menu mode="horizontal" defaultSelectedKeys={['list']} style={{ lineHeight: '64px' }}>
              <Menu.Item key="list">
                列表页
              </Menu.Item>
              <Menu.Item key="form">
                表单页
              </Menu.Item>
              <Menu.Item key="detail">
                详情页
              </Menu.Item>
              <Menu.Item key="exception">
                异常页
              </Menu.Item>
            </Menu>
            <Icon type="bell"/>
          </Header>
          <Content className="Index-text">
            <Breadcrumb>
            <Breadcrumb.Item>首页</Breadcrumb.Item>
            <Breadcrumb.Item>列表页</Breadcrumb.Item>
          </Breadcrumb>
          </Content>
          <Footer style={{ textAlign: 'center'}}>
            demo by yeshiyuan
          </Footer>
        </Layout>
      </Router>
    );
  }
}

export default App;
